<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--///////////////////////////////////////////////////////////////////////////////////////////////////
    //
    //		Styles
    //
    ///////////////////////////////////////////////////////////////////////////////////////////////////--> 
    <link rel="stylesheet" id="camera-css"  href="/mcouponMgr/css/camera.css" type="text/css" media="all"> 
    

    <title>jQuery Mobile Web App</title>
    <link href="/mcouponMgr/css/maokong.css" rel="stylesheet" type="text/css"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />

    <link rel="stylesheet"  href="/mcouponMgr/css/jquery.mobile.structure.css" />
    <link rel="stylesheet" href="/mcouponMgr/css/jquery.mobile.theme.css" />
  
    <script>
      var userAgent = navigator.userAgent + '';
      if (userAgent.indexOf('iPhone') > -1) {
        document.write('<script src="/mcouponMgr/js/lib/cordova-iphone.js"></sc' + 'ript>');
        var mobile_system = 'iphone';
      } else if (userAgent.indexOf('Android') > -1) {
          document.write('<script src="/mcouponMgr/js/lib/cordova-2.0.0.js"></sc' + 'ript>');
          document.write('<script src="/mcouponMgr/js/lib/barcodescanner.js"></sc' + 'ript>');
        var mobile_system = 'android';
      } else {
        var mobile_system = '';
      }
    </script>

    <script src="/mcouponMgr/js/lib/jquery.js"></script>
    <!-- your scripts here -->
    <script src="/mcouponMgr/js/app/app.js"></script>
    <script src="/mcouponMgr/js/app/bootstrap.js"></script>
    <script src="/mcouponMgr/js/lib/jquery.mobile.js"></script>
    <script type="text/javascript" src="/mcouponMgr/scripts/camera.min.js"></script> 
    <script>
	  function onDeviceReady() {
	    console.log("We got device ready");
	    cordova.exec(null, null, "SplashScreen", "hide", []);
	  }
	</script>
    <script>
      // 掃描 QR Code 並解碼
      var scanCode = function() {
        window.plugins.barcodeScanner.scan(
        function(result) {
        	if (!result.cancelled) { 
                setTimeout(function() {
                    $.mobile.changePage( result.text, { transition: "slideup"} ); 
                }, 500); 
            } 
        }, function(error) {
           alert("Scan failed: " + error);
        });
      }
 
      // 將你的文字編碼成 QR Code
      var encodeText = function() {
        window.plugins.barcodeScanner.encode(
        BarcodeScanner.Encode.TEXT_TYPE, 
        "kuro",  // 這裡是你想要編碼的文字
        function(success) {
            alert("Encode success: " + success);
        }, function(fail) {
            alert("Encoding failed: " + fail);
        });
      }
    </script>
  </head>
  <body>
  <div data-role="page" data-add-back-btn="true" data-back-btn-text="上一頁" data-back-btn-theme="e" id="page2" >
    <div data-role="header" class="title" data-theme="a" data-position="fixed">
      <div class="title" id="name"><img src="/mcouponMgr/images/name.png" /></div>
      <img src="/mcouponMgr/images/camera.png" />
      <div data-role="navbar" >
        <ul data-content-theme="e">
          <li><a href="/mcouponMgr/Stores/storeList/1"><img id="storeImg" src="/mcouponMgr/images/M_store2.png"/></a></li>
          <li><a href="/mcouponMgr/Promos/promoList/1"><img id="bonusImg" src="/mcouponMgr/images/M_bonus2.png"/></a></li>
          <li><a href="#contacts"><img src="/mcouponMgr/images/M_record2.png"/></a></li>
          <li><a href="#events"><img src="/mcouponMgr/images/M_favorite2.png" /></a></li>
        </ul>
      </div>
      <div data-role="navbar">
        <ul>  
          <li><a <?php if($tid==1){echo "class='ui-btn-active ui-state-persist'";}?> href="/mcouponMgr/Promos/promoList/1" data-theme="c">飲食</a>
          <li><a <?php if($tid==2){echo "class='ui-btn-active ui-state-persist'";}?> href="/mcouponMgr/Promos/promoList/2" data-theme="c">用餐</a>
          <li><a <?php if($tid==3){echo "class='ui-btn-active ui-state-persist'";}?> href="/mcouponMgr/Promos/promoList/3" data-theme="c">購物</a>
          <li><a <?php if($tid==4){echo "class='ui-btn-active ui-state-persist'";}?> href="/mcouponMgr/Promos/promoList/4" data-theme="c">咖啡</a>
          <li><a <?php if($tid>=5){echo "class='ui-btn-active ui-state-persist'";}?> href="/mcouponMgr/Promos/promoList/5" data-theme="c">附近店家</a>
        </ul>
      </div>
    </div>
    <div id="page2Content" data-role="content">
      <ul id="stroeListView" data-role="listview" data-theme="d" data-filter="true" data-inset="false"  data-filter-placeholder= "請輸入關鍵字" data-split-icon="info">
	  <?php 
	  if($stores){ 
        foreach($stores as $store):
          //測試查詢<1公里附近店家
	      $EARTH_RADIUS = 6378.137;
	      $lat1 = 24.966067;
	      $lng1 = 121.5830;
	      $lat2 = $store['C']['latitude'];
	      $lng2 = $store['C']['longitude'];
	      $radLat1 = $lat1 * pi() / 180.0;
	      $radLat2 = $lat2 * pi() / 180.0;
	      $c = $radLat1 - $radLat2;
	      $radLng1 = $lng1 * pi() / 180.0;
	      $radLng2 = $lng2 * pi() / 180.0;
	      $b = ($lng1 * pi() / 180.0) - ($lng2 * pi() / 180.0);
	      $s = 2 * asin(sqrt(pow(sin($c / 2), 2) + cos($radLat1) * cos($radLat2) * pow(sin($b / 2), 2)));
	      $s = $s * $EARTH_RADIUS;
	      $s = round($s * 10000) / 10000;
	
	      if($tid<5){?> 
	        <li>
	          <a href="<?php echo "/mcouponMgr/Promos/promoList/".$tid."/".$store['C']['id']."#page5";?>" data-rel="dialog"> 
                <img src="/takming/images/7-11.jpg">                          
                <div>                                                          
		          <div><?php echo $store['C']['name'];echo $store['C']['tel'];?></div>                                       
		          <div><?php echo $store['C']['addr'];?></div>
		          <div><?php echo $s*1000;?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;公尺</div>   
		        </div>                                                               
		      </a>   
    <?php }else{
      	    if($s <= 1){?>
              <li> 
    	        <a href="<?php echo "/mcouponMgr/Promos/promoList/".$tid."/".$store['C']['id']."#page5";?>" data-rel="dialog"> 
                  <img src="/takming/images/7-11.jpg">                          
	              <div>                                                              
		            <div><?php echo $store['C']['name'];echo $store['C']['tel'];?></div>                                       
		            <div><?php echo $store['C']['addr'];?></div>
		            <div><?php echo $s*1000;?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;公尺</div>                   
		          </div>                                                               
		        </a>  
      <?php }
          }
        endforeach;
      }else{?> 
        <li>                         
	      <div>                                                              
		    <div align="center">目前沒有資料</div>                                                        
		  </div>                                                                
<?php }?>                                                                                                                       
	  </ul>
    </div>
    <div data-role="footer" data-position="fixed">
      <div data-role="navbar" data-theme="c">
        <ul>
          <li><a href="maps2.html"   rel="external"><img src="/mcouponMgr/images/map.png"/></a></li>
          <li><a href="#" onclick="scanCode()"><img src="/mcouponMgr/images/foot_cam.png"/></a></li>
          <li><a href="#contacts"><img src="/mcouponMgr/images/foot_set.png"/></a></li>
        </ul>
      </div>
    </div>
  </div>
  <div data-role="page" data-add-back-btn="true" data-back-btn-text="上一頁" data-back-btn-theme="e" id="page5">
    <div data-role="header" class="title" data-theme="a" data-position="fixed">
    <h1>限量優惠</h1>
    </div>
    <div data-role="content">
      <ul data-role="listview" data-inset="true" data-split-icon="gear">
  <?php if($promos){
          foreach($promos as $promo): 
  ?>    
            <li>
              <a href="<?php echo "/mcouponMgr/Stores/storeShow/".$tid."/".$sid."/".$promo['promos']['id']; ?>" rel="external">
                <img src="/mcouponMgr/images/7-11.jpg">
                <h3><?php echo $promo['promos']['title'];?></h3>
                <p><?php echo $promo['promos']['content'];?></p>
                <span class="ui-li-count">己兌換<?php echo $promo['promos']['exchangeQuantity'];?>份</span>
                <p class="ui-li-aside">限量<?php echo $promo['promos']['limitQuantity'];?>份</p>
              </a>
              <a href="basic2.html" rel="external">Default</a>
            </li>
  <?php   endforeach;
        }else{?>
            <li>                         
	        <div>                                                              
		         <div align="center">目前沒有限量優惠</div>                                                        
		    </div>  
  <?php }?>
      </ul>
    </div>
  </div>
  </body>
</html>
